<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>2.6 动态脚本js介绍</title>
    <script>
        // 一、js的变量和数据类型
        let name = "张三"; // 字符串类型
        var age = 20; // 数字类型
        console.log("（name,age):",name,age); // 输出：张三
        // 二、js函数的定义
        function add(a, b) { // 定义一个函数，接收两个参数a和b
            console.log("===执行add函数==="); // 输出提示信息
            return a + b; // 返回a和b的和
        }
        result= add(1, 2); // 调用add函数，传入参数1和2
        console.log("result:",result); // 输出结果：3
        // 三、js事件
        function login() { // 定义一个函数，用于登录
            console.log("===执行login函数==="); // 输出提示信息
            let username = document.getElementById("username").value; // 获取用户名输入框的值
            let password = document.getElementById("password").value; // 获取密码输入框的值
            console.log("username:",username); // 输出用户名
            console.log("password:",password); // 输出密码
            if (username === "admin" && password === "123456") { // 判断用户名和密码是否正确
                alert("登录成功"); // 弹出提示框
            } else { // 否则
                alert("登录失败"); // 弹出提示框
            }
        }

    </script>
</head>
<body>
    <h1>2.6 动态脚本js介绍</h1>
    <!--表单，用户名和密码-->
    <form action="#">
        <label for="username">用户名：</label>
        <input type="text" id="username" name="username">
        <br>
        <label for="password">密    码：</label>
        <input type="password" id="password" name="password">
        <br>
        <input type="submit" value="提交" onclick="login()">
    </form>
   
</html>